<template>
  <div class="cellphone">
    <van-nav-bar
      left-text="手机号登入"
      left-arrow
      @click-left="$router.go(-1)"
    />

    <div class="cell-item">
      <van-cell-group>
        <van-field v-model="phone" placeholder="+86 请输入手机号" />
      </van-cell-group>
    </div>
    <van-button type="primary" block class="iphone" @click="isClick"
      >下一步</van-button
    >
    <van-loading
      type="spinner"
      size="24px"
      color="#0094ff"
      v-show="isLoading"
    />
  </div>
</template>

<script>
import { isPhone, isCode } from './user'
import { Toast } from 'vant'
import { setToken } from '@/utils/cookie'
export default {
  name: 'cellphone',
  data () {
    return {
      phone: '',
      isLoading: false
    }
  },
  methods: {
    async isClick () {
      this.isLoading = true
      // console.log(this.phone)
      let res = await isPhone({ phone: this.phone })
      if (res.data.exist == -1) {
        setTimeout(() => {
          this.isLoading = false
          Toast.fail('还没有注册,请先完成注册')
          this.$router.push({ path: '/zhuce' })
        }, 2000)
      } else {
        setTimeout(() => {
          Toast.success('登入成功')
          this.$router.push({ path: '/home' })
          setToken('pxk', Date.now())
        }, 2000)
      }
      console.log(res)
    }
  }
}
</script>

<style scoped>
.van-nav-bar {
  height: 30px;
}
.van-nav-bar__text,
.van-icon {
  margin-bottom: 10px;
}
.cell-item {
  margin-top: 40px;
}
.van-button {
  margin-bottom: 20px;
  width: 280px;
  margin: 20px auto;
  height: 30px;
  border-radius: 20px;
  background-color: #ff3a3a;
  border: 0;
  color: #fff;
}
.van-loading {
  text-align: center;
}
</style>
